!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="">
</head>
<style>
    * {
        margin: 0px;
        padding: 0px;
        text-decoration: none;
    }

    .shanghei {
        background-color: black;
        color: azure;
        height: 60px;
        line-height: 60px;
        position: relative;
        margin-top: -10px;
    }

    .shangheimian {

        width: 80%;
        margin: 10px auto;
    }

    .shangheimian a {
        text-decoration: none;
        color: aliceblue;
        float: left;
        width: 260px;
        text-align: center
    }

    .suoyoutupian {
        text-align: center;
        margin-top: 260px;
    }

    .bb {
        margin-left: 40px;
        margin-top: -200px;
    }

    .zhongjianbai {
        width: 90%;
        margin: 0px auto;
        background-color: rgb(219, 227, 234);
        margin-top: 100px;
        width: 600px;

    }
</style>

<body>
    <div class="shanghei">
        <div class="shangheimian">
            <h2>
                <a class="a" href=""><img src="./index/logo.png" alt="">网易云音乐|云推歌</a>
            </h2>
            <a class="aa" href="">首页</a>
            <a class="aaa" href="">我的订单</a>
            <a class="aaaa" href="">账户充值</a>
            <h2>
                <a class="b" href="">登录</a>
            </h2>
        </div>
    </div>
    <div class="zhongjianbai">
        <div class="suoyoutupian">
            <img src="./index/sao.png" alt="" width="30%">
            <a class="bb" href=""><img src="./index/saoma.png" width="30%" alt=""></a>
            <br>
            <input type="submit" value="选择其他登录模式">
        </div>
    </div>
    </div>
</body>

</html>